
#{extends 'template.html'/}

  <body>

	  
	  
	  
	  
	  
	  
	  
	  <!-- CONTAINER -->
	  
	  
	  <div class="container topo">
		  
		  
		  <div class="row primeiraLinha">
			
			
			<div class="col-md-4 logo">
				<a href="@{Application.index()}">
				<img src="@{'/public/images/home_logo.png'}" />
				</a>
			</div>
			  
			 
			
			<div class="col-md-3 col-md-offset-5 inscrevaSe">
				
				<a href="#" class="btn btn-default btnInscrevaSe">Inscreva-se</a>
				
				
			</div>
			
			
			
			
			<div class="row">
				
				<div class="col-md-12 titulosTxt">
				
				<h1 class="homeTitulo">viva experiências locais</h1>
				<h2 class="homeSubTitulo">descubra atividades com pessoas que falam sua língua nativa</h2>
				
				</div>
				
				
			</div>
			
			
			<div class="row">
				
				<div class="col-md-12 cidades">
				
				
					<ul>
					
						<li><a href="#">Fortaleza</a></li>
						<li><a href="#">Brasília</a></li>
						<li><a href="#">Madrid</a></li>
						<li><a href="#">Barcelona</a></li>
						<li class="ultima"><a href="#">São Francisco</a></li>
						
						
					</ul>
				
								
				</div>
				
				
			</div>

			
			
			
			
			
			
			
			<div class="setaBaixo">
				
				<a href="#about">
					
					 <img src="@{'/public/images/setaBaixo.png'}" />
					
				</a>
				
			</div>
			
			  
			  
		  </div><! /row primeiraLinha -->
		  
		  
		  
	  </div><!-- FIM CONTAINER -->
	  
	  
	  	  
	  
	 <!-- EXPERIENCIAS -->
	  <div id="about" class="container experiencias">
		  
		  <div class="row">
			  
			  
			  <div class="col-md-12 legendaTxt">
				  
				  
				  <h1 class="tituloContHome">experiências</h1>
				  <h2 class="subTituloContHome">Encontre uma atividade, você pode selecionar por destino<br>
ou categorias específicas (esportes, gastronomia, fotografia...)</h2>

				  
				  
			  </div><!-- /col-md-12 -->
			  
			  
		  </div><!-- / row -->
		  
		  
		  
		  <div class="row contExperiencias">
			  
			  
			  <div class="col-md-12 noPadding">
			  
			  
			
			  
			  			  
			    #{list items:experiencia, as:'exp'} 
			  <!-- col-md-4 -->
			  <div class="col-md-4 colExp">
				  
				
				<div class="thumbnail boxExp">
				
				      <a href="@{Experiencias.index(exp)}"><img src="${exp?.exp_caminho_ima_home}"/></a>
				      
				      <div class="caption contExp">
				      
				        <h3 class="tiExp"><a href="#">${exp.exp_titulo}</a></h3>
				        
				        <h4 class="tiAutor">com <a href="#">${exp.exp_speakr}</a></h4>
				        
				        <p class="txtExp">
					    	${exp.exp_descricao}    
				        </p>
				        
				        <div class="linhaCategoria">
							<p class="localExp"><b>${exp.exp_cidade}</b> / ${exp.exp_pais}</p>
						
							<p class="categoriaExp">${exp.exp_categoria}</p>
				        </div>
				      
				      </div>
				 
				 </div>
				 

			  </div><!-- /col-md-4 -->
			  #{/list}

			

			  
			  
			
				  

				  
			  </div><!-- col-md-12 -->
			  
			  
		  </div><!-- /row -->
		  
		 
		  
		  
	  </div><!-- FIM EXPERIENCIAS --> 
	  
	  
	  
	  
	  
	  
	  
	  
	  
	  
	  	  <!-- INSCREVA-SE -->
	  <div class="container inscrevase">
		  
		  <div class="row">
			  
			  
			  <div class="col-md-12 legendaTxt">
				  
				  
				  <h1 class="tituloContHomeV">inscreva-se</h1>
				  <h2 class="subTituloContHomeV">
					  
					  Speakrs está atualmente disponível apenas para usuários convidados.<br>
					  A versão final estará disponível em breve.<br><br>
					  
					  Abaixo digite seu e-mail para obter acesso prioritário!<br>
					  <i>(Não se preocupe, só enviaremos coisas importantes)</i>
					  
				  </h2>

				  
				  
			  </div><!-- /col-md-12 -->
			  
			  
		  </div><!-- / row -->
		  
		  
		  <div class="row linhaForm">
				  
				  <div class="col-md-2"></div>
				  
				  <div class="col-md-8">
				  
					  
					 
					<!-- RESPOSTA DO CADASTRO DE EMAIL -->
						  
						  <p class="respostaInscrevaSe">
						  Email cadastrado com sucesso!<br>
						  Verifique a seu email para confirmar o seu cadastro.
						  </p>
						  
					<!-- RESPOSTA DO CADASTRO DE EMAIL -->	  
					  
					  
					  
					  <form class="form-inline" role="form">
					
						  <div class="form-group">
					
						    <input type="email" class="form-control insInput" id="exampleInputEmail1" placeholder="Digite seu email">
						    <button type="submit" class="btn btn-default btnInscrevaEmail">Inscreva-se</button>
					
						  </div>
					  
					  </form>

					  
				  </div><!-- / col-md-12 -->
				  
				  <div class="col-md-2"></div>
			   
			   
		  </div><!-- / row -->
		  
		  
	  </div><!-- FIM INSCREVA-SE -->








	   <!-- MENSAGEM -->
	  <div class="container mensagem">
		  
		  <div class="row">
			  
			  
			  <div class="col-md-12 legendaTxt">
				  
				  
				  <h1 class="tituloContHome">Experiência Personalizada</h1>
				  <h2 class="subTituloContHome">Solicite uma experiência e tire dúvidas de como funciona a plataforma.</h2>

				  
				  
			  </div><!-- /col-md-12 -->
			  
			  
		  </div><!-- / row -->
		  
		  
		  <div class="row mTop">
			  
			  <div class="col-md-3"></div>
			  
			  <div class="col-md-6">
				  
				  
				  <form class="form-horizontal" role="form">
					
						  <div class="form-group">
					
						    <input type="email" class="form-control msgInput" id="exampleInputEmail1" placeholder="Seu nome">
						    <input type="email" class="form-control msgInput" id="exampleInputEmail1" placeholder="Seu email">
						    <textarea class="form-control msgInputTA" rows="5" placeholder="Mensagem"></textarea> 

						    
						    <button type="submit" class="btn btn-default btnEnviarMsg">Enviar</button>
					
						  </div>
					  
					  </form>
				  
				  
				  
			  </div>
			  
			  <div class="col-md-3"></div>
			  
			  
		  </div>
		  
	  </div><!-- FIM MENSAGEM -->
	  
	  
	  
	  	 <div class="container rodape">
		  
		<div class="row col-centered">
			
			<div class="col-md-4">
				
				<p class="copy">Copyright © Speakrs 2014</p>
			
			</div>
			
			<div class="col-md-3 col-md-offset-5 icoRedes">
				
				<a href="#" target="_blank">
					<img src="@{'/public/images/ico_facebook.jpg'}" />
				</a>
				
				<a href="#" target="_blank">
					<img src="@{'/public/images/ico_twitter.jpg'}" />
				</a>
				
			</div>
			
		</div>
				  
	  </div><!-- /container -->

	  








 <script src="@{'/public/javascripts/jquery-1.10.2.js'}"></script>
<script src="@{'/public/javascripts/bootstrap.js'}"></script>
 <script>
    $("#menu-close").click(function(e) {
        e.preventDefault();
        $("#sidebar-wrapper").toggleClass("active");
    });
    </script>
    <script>
    $("#menu-toggle").click(function(e) {
        e.preventDefault();
        $("#sidebar-wrapper").toggleClass("active");
    });
    </script>
 <script>
    $(function() {
        $('a[href*=#]:not([href=#])').click(function() {
            if (location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '') || location.hostname == this.hostname) {

                var target = $(this.hash);
                target = target.length ? target : $('[name=' + this.hash.slice(1) + ']');
                if (target.length) {
                    $('html,body').animate({
                        scrollTop: target.offset().top
                    }, 1000);
                    return false;
                }
            }
        });
    });
    </script>


  </body>
